<div id="floating_menubar" class="w-100 position-fixed top-0 start-0 end-0 d-print-none"></div>
<nav id="server-breadcrumb" aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-navbar">
    <li class="breadcrumb-item">
      {{ show_icons('TabsMode') ? get_image('s_host') }}
      <a href="{{ url(server.url) }}" data-raw-text="{{ server.name }}" draggable="false">
        {% if show_text('TabsMode') %}{{ t('Server:') }}{% endif %}
        {{ server.name }}
      </a>
    </li>

    {% if database is not empty %}
      <li class="breadcrumb-item">
        {{ show_icons('TabsMode') ? get_image('s_db') }}
        <a href="{{ url(database.url, {'db': database.name}) }}" data-raw-text="{{ database.name }}" draggable="false">
          {% if show_text('TabsMode') %}{{ t('Database:') }}{% endif %}
          {{ database.name }}
        </a>
      </li>

      {% if table is not empty %}
        <li class="breadcrumb-item">
          {{ show_icons('TabsMode') ? get_image(table.is_view ? 'b_views' : 's_tbl') }}
          <a href="{{ url(table.url, {'db': database.name, 'table': table.name}) }}" data-raw-text="{{ table.name }}" draggable="false">
            {% if show_text('TabsMode') %}
              {% if table.is_view %}
                {{ t('View:') }}
              {% else %}
                {{ t('Table:') }}
              {% endif %}
            {% endif %}
            {{ table.name }}
          </a>
        </li>

        {% if table.comment is not empty %}
          <span class="breadcrumb-comment" draggable="false">“{{ table.comment }}”</span>
        {% endif %}
      {% elseif database.comment is defined and database.comment is not empty %}
        <span class="breadcrumb-comment" draggable="false">“{{ database.comment }}”</span>
      {% endif %}
    {% endif %}
  </ol>
</nav>

<div id="topmenucontainer" class="menucontainer">
  <nav class="navbar navbar-expand-lg">
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-label="
      {{- t('Toggle navigation', notes = 'Show or hide the menu using the hamburger style button') }}" aria-controls="navbarNav" aria-expanded="false">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNav">
      <ul id="topmenu" class="navbar-nav">
        {% for tab in tabs %}
          <li class="nav-item{{ tab.active ? ' active' }}">
            <a class="nav-link text-nowrap disableAjax" href="{{ url(tab.route, url_params|merge(tab.args ?? [])) }}">
              {{ get_icon(tab.icon, tab.text, false, true, 'TabsMode') }}
              {% if tab.active %}
                <span class="visually-hidden">{{ t('(current)', notes = 'Current page') }}</span>
              {% endif %}
            </a>
          </li>
        {% endfor %}
      </ul>
    </div>
  </nav>
</div>
